<template>
  <view class="container">
    <uv-navbar
      :title="flag == 1 ? '商家信息' : '我的'"
      bg-color="none"
      @leftClick="leftClick"
    ></uv-navbar>
    <view class="mine-box">
      <uv-cell
        :title="flag == 1 ? '商家名称' : '用户名称'"
        :border="false"
        :value="info.merchantName"
      ></uv-cell>
      <uv-cell
        title="商家简称"
        :border="false"
        :value="info.abbreviationName"
        v-if="flag == 1"
      ></uv-cell>
      <uv-cell
        :title="flag == 1 ? '商家头像' : '用户头像'"
        :border="false"
        @click="upload"
      >
        <template v-slot:value>
          <image
            class="head_portrait"
            :src="head_portrait || info.merchantLogo"
            mode="aspectFill"
          ></image>
        </template>
        <template v-slot:right-icon>
          <uv-icon size="30rpx" name="arrow-right"></uv-icon>
        </template>
      </uv-cell>
      <uv-cell
        title="服务类型"
        :border="false"
        :value="info.merchantType == 1 ? '正式版' : '适用版' + time"
        @click="() => {}"
        v-if="flag == 1"
      >
        <!-- <template v-slot:right-icon>
					<uv-icon size="30rpx" name="arrow-right"></uv-icon>
				</template> -->
      </uv-cell>
    </view>
    <view class="tips">如果需要修改名称，请联系我们的工作人员</view>
  </view>
</template>

<script>
const app = getApp();
import { timeFormat } from "@/uni_modules/uv-ui-tools/libs/function/index.js";
import { updateInfo } from "@/common/api.js";
import siteinfo from "siteinfo.js";
export default {
  data() {
    return {
      head_portrait: "",
      flag: "",
    };
  },
  computed: {
    info() {
      return this.$store.state.user.wx_merchantInfo;
    },
    time() {
      return uni.$uv.timeFormat(this.info.thaliEndTime, "yyyy年mm月dd日");
    },
  },
  onShow() {
    this.flag = this.$store.state.user.flag;
  },

  methods: {
    leftClick() {
      // app.navigationTo('page_account/activity/list')
      app.navigateBack();
    },
    upload() {
      if (this.flag != 1) {
        return false;
      }
      uni.chooseImage({
        count: 1,
        sourceType: ["album", "camera"],
        success: (resolve) => {
          uni.showLoading({
            title: "上传中...",
          });
          let tempFilePaths = resolve.tempFilePaths[0];
          const baseURL = siteinfo.siteroot;
          const uploadTask = uni.uploadFile({
            url: baseURL + "/system/oss/upload", //上传接口地址
            filePath: tempFilePaths,
            name: "file",
            success: (uploadFileRes) => {
              let data = JSON.parse(uploadFileRes.data);
              updateInfo({
                merchantLogo: data.data.url,
              })
                .then((res) => {
                  console.log(res);
                  this.head_portrait = data.data.url;
                  uni.$emit("update");
                  uni.hideLoading();
                })
                .catch(() => {
                  uni.hideLoading();
                });
            },
          });
          // uploadTask.onProgressUpdate((res) => {
          // 	console.log('上传' + res);
          // 	console.log('上传进度' + res.progress);
          // 	console.log('已经上传的数据长度' + res.totalBytesSent);
          // 	console.log('预期需要上传的数据总长度' + res.totalBytesExpectedToSend);

          // 	// 测试条件，取消上传任务。
          // 	if (res.progress > 50000) {
          // 		uploadTask.abort();
          // 	}
          // });
        },
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.container {
  overflow: hidden;
  min-height: 100vh;
  width: 100vw;
  padding: 40rpx;
  padding-top: 226rpx;
  // padding-bottom: calc(96rpx + 32rpx + 22rpx);
  box-sizing: border-box;
  background: radial-gradient(
    128% 128% at 95% 0%,
    #d7ceff 0%,
    #bbe1ff 62%,
    #ffffff 95%
  );

  .mine-box {
    // min-height: 432rpx;
    padding: 40rpx;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 32rpx;
    border: 2rpx solid #ffffff;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box;

    .head_portrait {
      width: 80rpx;
      height: 80rpx;
      border-radius: 40rpx;
    }
  }

  /deep/.uv-cell__body {
    padding: 0;

    .uv-cell__title-text,
    .uv-cell__value {
      font-weight: 400;
      font-size: 28rpx;
      color: #000000;
      line-height: 48rpx;
    }
  }

  .tips {
    width: 100%;
    font-weight: 400;
    font-size: 24rpx;
    color: #4e5969;
    line-height: 44rpx;
    position: absolute;
    bottom: 66rpx;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
  }
}
</style>
